<!--添加管理员信息-->

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		
			<link rel="stylesheet" href="/static/css/backstage/amazeui.min.css" >
		<link rel="stylesheet" href="/static/css/backstage/admin.css" >
		<link rel="stylesheet" href="/static/css/backstage/app.css" >
		<style>
			.admin-main{
				padding-top: 0px;
			}
			.error{
				color:red;
			}
			.success{
				color:#5eb95e;
			}
		</style>
	</head>
	<body>

		<div class="am-cf admin-main">
			<!-- content start -->
			<div class="admin-content">
				<div class="admin-content-body">
					<div class="am-g">
						<form class="am-form am-form-horizontal" action="/backstage/addRole" method="post" style="padding-top: 30px;" name="myform">
							<div class="am-form-group">
								<label for="user-name" class="am-u-sm-3 am-form-label">
									用户名
								</label>
								<div class="am-u-sm-9">
									<input id="userName" required="" placeholder="请输入用户名" onBlur="checkUserName()" value="" name="roleName" type="text">
									<small id="nameErr">输入用户名。</small>
								</div>
							</div>
							<div class="am-form-group">
								<label for="user-name" class="am-u-sm-3 am-form-label">
									密码
								</label>
								<div class="am-u-sm-9">
									<input id="password" required="" placeholder="请输入密码" onBlur="checkPassword()" value="" name="password" type="text">
									<small id="passwordErr">输入密码。</small>
								</div>
							</div>
							<div class="am-form-group">
								<label for="user-name" class="am-u-sm-3 am-form-label">
									真实姓名
								</label>
								<div class="am-u-sm-9">
									<input id="realName" required="" placeholder="请输入真实姓名" onBlur="checkRealName()" maxlength="5" value="" name="realName" type="text">
									<small id="realnameErr">输入真实姓名。</small>
								</div>
							</div>
							<div class="am-form-group">
								<label for="user-name" class="am-u-sm-3 am-form-label">
									手机号
								</label>
								<div class="am-u-sm-9">
									<input id="phone" required="" placeholder="请输入手机号" onBlur="checkPhone()" value="" name="phone" type="text">
									<small id="phoneErr">输入手机号。</small>
								</div>
							</div>

							<div class="am-form-group">
								<div class="am-u-sm-9 am-u-sm-push-3">
									<input id="addRole" class="am-btn am-btn-success" value="添加角色" type="button">
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
		<script type="text/javascript" src="/static/js/backstage/jquery-1.8.3.js"></script>
		<script type="text/javascript">
                function checkUserName(){
                    var username = document.getElementById('userName');
                    var errname = document.getElementById('nameErr');
                    var pattern = /^[\w\u4E00-\u9FA5]{3,}$/;  //用户名格式正则表达式：用户名要至少三位
                    if(username.value.length == 0){
                        errname.innerHTML="用户名不能为空";
                        errname.className="error";
                        return false;
                    }
                    if(!pattern.test(username.value)){
                        errname.innerHTML="用户名为3位以上的字母、数字、下划线组合";
                        errname.className="error";
                        return false;
                    }
                    else{
                        errname.innerHTML="OK";
                        errname.className="success";
                        return true;
                    }
                }
                //验证密码
                function checkPassword(){
                    var userpasswd = document.getElementById('password').value;
                    var reg = /^.*[~!@#\$%\^&\*\(\)_+\-=\[\]\{\}\\\|\'\";:,\<\.\>\/\?\s+].*$/;
                    var regNumber = /\d+/; //验证0-9的任意数字最少出现1次。
                    var regString = /[a-zA-Z]+/; //验证大小写26个字母任意字母最少出现1次。
                    if(userpasswd.length == 0){
                        document.getElementById('passwordErr').innerHTML="密码不能为空";
                        document.getElementById('passwordErr').className="error";
                        return false;
                    }
                    else if(userpasswd.length<4||userpasswd.length>18){
                        document.getElementById('passwordErr').innerHTML="密码长度要大于4个字符并且小于18个字符";
                        document.getElementById('passwordErr').className="error";
                        return false;
                    }
                    else if(!(regNumber.test(userpasswd) && regString.test(userpasswd) || reg.test(userpasswd))){
                        document.getElementById('passwordErr').className="error";
                        document.getElementById('passwordErr').innerHTML="密码中要包含字符串、数字可包含特殊符号！";
                        return false;
                    }
                    else{
                        document.getElementById('passwordErr').className="success";
                        document.getElementById('passwordErr').innerHTML="OK";
                        return true;
                    }
                }

                //验证姓名
                function checkRealName(){
                    var username = document.getElementById('realName');
                    var errname = document.getElementById('realnameErr');
                    var pattern = /^[\u4E00-\u9FA5]{2,5}$/;
                    if(username.value.length == 0){
                        errname.innerHTML="姓名不能为空";
                        errname.className="error";
                        return false;
                    }
                    if(!pattern.test(username.value)){
                        errname.innerHTML="姓名不合规范";
                        errname.className="error";
                        return false;
                    }
                    else{
                        errname.innerHTML="OK";
                        errname.className="success";
                        return true;
                    }
                }

				//验证手机号
                function checkPhone(){
                    var phone = document.getElementById('phone');
                    var errname = document.getElementById('phoneErr');
                    var pattern = /^1[3|4|5|7|8][0-9]{9}$/;
                    if(phone.value.length == 0){
                        errname.innerHTML="手机号不能为空";
                        errname.className="error";
                        return false;
                    }
                    if(!pattern.test(phone.value)){
                        errname.innerHTML="手机号不合规范";
                        errname.className="error";
                        return false;
                    }
                    else{
                        errname.innerHTML="OK";
                        errname.className="success";
                        return true;
                    }
                }


                $("#addRole").click(function(){
                	if(checkUserName()&&checkPassword()&&checkRealName()&&checkPhone())
                	{
                		$.ajax({
							url:"/backstage/addRole",
							dataType:"json",
							type:"post",
							data:$("form").serialize(),
							success:function(result){
								<!--console.log(result);-->
								alert(result.tips);
								window.location.href=location.href;
							},
							error:function(result){
              				  	<!--console.log(result);-->
              				  	alert("系统繁忙！");
           					 }
						});
					}
                		<!--myform.submit();-->
                });

    </script>
	</body>
</html>
